<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>购物车</title>
    <script src="/static/mobile/js/mui.min.js"></script>
    <link href="/static/mobile/css/mui.min.css" rel="stylesheet"/>
    <link rel="stylesheet" type="text/css" href="/static/mobile/css/basic.css"/>
    <link rel="stylesheet" type="text/css" href="/static/mobile/css/shopping_car.css"/>
    <script type="text/javascript" src="/static/mobile/js/jquery.js"></script>
    <script type="text/javascript" charset="utf-8">
      	mui.init();
    </script>
</head>
<body>
	<div class="sectionx">
		<header class="mui-bar mui-bar-nav" >
			<!--<a class="mui-icon mui-icon-left-nav mui-pull-left" href="javascript:history.back(-1)" style="color: #4E4E4E;"></a>-->
			<h1 class="mui-title">购物车</h1>
			<!--<a class="mui-icon mui-pull-right right1" href="javascript:;"style="color: #4E4E4E;font-size: 1rem;">编辑</a>-->
		</header>
	</div>
	<div class="section2">
		<form action="{:url('user/shop/buy')}" method="get">
		<input type='hidden' value='1' name='num' id='innum'>
			<div class="section2-1">
				<ul>
				
				 {volist name="lists" id="vo" }
					<li class="li1">
						<a href="javascript:void(0);" class="mui-clearfix">
							<div class="div1">
								<input type="radio" class='chank' name="id"  value="{$vo.bid}" ckecked="" />
							</div>
							<div class="div2">
								<img src="{$vo.thumb}"/>
							</div>
							<div class="div3">
								<p class="p1">{$vo.title}</p>
								<p class="p2"><span>库存：{$vo.kucun}</span><span></span></p>
								<div class="zjk mui-clearfix">
									<p class="p2">¥ {$vo.jiage}</p>
									<p class="p3"><input type="button" value="-" data={$vo.bid} class="btn_1"/><span class="num">1</span><input type="button" value="+"  data={$vo.bid} class="btn_2"/></p>
								</div>
							</div>
							<div class="div4">
								<img src="/static/mobile/images/del.jpg" data={$vo.id} class="remove"/>
							</div>
						</a>
					</li>
					 {/volist}
					
					
					
				</ul>
			</div>
			<div class="section2-2">
					<div class="section2-2-1">
					<!----	<img src="/static/mobile/images/c_checkbox_off.png" class="all_1" style="display: none;"/>
						<img src="/static/mobile/images/c_checkbox_on.png" class="all"/>
						<span>全选</span>--->
					</div>
					<div class="section2-2-2">
						合计：<span id='zongjia'>¥ 00.00</span>
					</div>
					<div class="section2-2-3">
						<input type="submit"  value="结算" id='myBtn'/>
					</div>
					</form>
			</div>
			
		</form>
	</div>
	
	
	
	<div class="kong"></div>
	<div class="kong"></div>
	{include file="common/foot"/}
</body>
<script>
	$(function(){
		 $(".chank").eq(0).attr("checked","checked");
		//获取第一个值
		idsss= $(".chank").eq(0).attr('value');
		
		jisuan(idsss,1)
		
		$(".btn_2").click(function(){
			var dd =$(this).siblings(".num").text();
			dd++;
			id=$(this).attr('data')
			$(this).siblings(".num").text(dd);
			
				jisuan(id,dd)
			
		});
		$('.chank').click(function(){
		id=$(this).attr('value');
		
			jisuan(id,1)
		
		})
		function jisuan(id,dd){
			$('#innum').val(dd);
			$.ajax({
					type : "POST",  //请求方式
					url : "{:url('user/shop/jisuan' )}",  //请求路径
					dataType:"html",
					data :'id='+id+"&num="+dd,
					success : function(msg) {  //异步请求成功执行的回调函数
						
						$('#zongjia').html('¥ '+msg);
						
					}
				});
				
		}
		$(".btn_1").click(function(){
			var dd =$(this).siblings(".num").text();
				id=$(this).attr('data')
			dd--;
			if(dd<=1){
			    $(this).siblings(".num").text('1');
			  }else{
			    $(this).siblings(".num").text(dd);
			  }
			  jisuan(id,dd)
		});
		
		$(".remove").click(function(){
		$(this).parentsUntil("li").parent().remove();
				var id = $(this).attr('data');
				$.ajax({
					type : "POST",  //请求方式
					url : "{:url('user/shop/dellshop' )}",  //请求路径
					dataType:"html",
					data :'id='+id,
					success : function(msg) {  //异步请求成功执行的回调函数
					
						if(msg==1){
							$(this).parentsUntil("li").parent().remove();
						}else{
							alert('删除失败');
						
						}
						
						
					}
				});
			
		});
		
		$(".all").click(function(){
			$(".all").hide();
			$(".all_1").show();
			$(".yes").hide();
			$(".no").show();
			$("[name='checkbox']").removeAttr("checked");
		});
		$(".all_1").click(function(){
			$(".all").show();
			$(".all_1").hide();
			$(".yes").show();
			$(".no").hide();
			$("[name='checkbox']").attr("checked",'true');
		});
		
		
	})
</script>


</html>